آموزش Next.js از توسعه تا استقرار: ایجاد یک وب سایت رویداد موسیقی [ویدئو]

سرفصل ها و درس ها

مقدمه دوره Introduction to the Course

• به دوره خوش آمدید Welcome to the Course

• Next.js چیست؟ What is Next.js?

• بررسی اجمالی پروژه اصلی Main Project Overview

• محیط و ابزار Environment and Tools

Next.js Fundamentals Next.js Fundamentals

• ایجاد یک برنامه Next.js Creating a Next.js App

• صفحات و مسیریابی Pages and Routing

• لینک بعدی و روتر Next Link and Router

• برچسب ها و طرح بندی سر Head Tags and Layout

• سربرگ و پاورقی S S Header and Footer

• صفحه سفارشی 404 Custom 404 Page

• نام مستعار ماژول با jsconfig Module Aliases with jsconfig

• کامپوننت ویترین Showcase Component

واکشی داده ها Data Fetching

• مسیرهای API API Routes

• مسیرهای API API Routes

• getServerSideProps و getStaticProps getServerSideProps and getStaticProps

• getServerSideProps و getStaticProps getServerSideProps and getStaticProps

• نمایش رویدادها Displaying Events

• نمایش رویدادها Displaying Events

• getStaticPaths getStaticPaths

• getStaticPaths getStaticPaths

• صفحه رویداد واحد Single Event Page

• صفحه رویداد واحد Single Event Page

Strapi Backend Strapi Backend

Strapi Backend Strapi Backend

• راه اندازی Strapi CMS Strapi CMS Setup

• راه اندازی Strapi CMS Strapi CMS Setup

• ابری برای تصاویر Cloudinary for Images

• ابری برای تصاویر Cloudinary for Images

• نوع محتوای رویداد Event Content Type

• نوع محتوای رویداد Event Content Type

عملکرد رویدادها - قسمت 1 Events Functionality - Part 1

عملکرد رویدادها - قسمت 1 Events Functionality - Part 1

• اتصال به Strapi API Connecting to the Strapi API

• اتصال به Strapi API Connecting to the Strapi API

• جستجوی صفحه با استفاده از فیلترها Search Page Using Filters

• جستجوی صفحه با استفاده از فیلترها Search Page Using Filters

• کامپوننت جستجو Search Component

• کامپوننت جستجو Search Component

• افزودن صفحه رویداد Add Event Page

• افزودن صفحه رویداد Add Event Page

• Event Submit و React Toastify Event Submit and React Toastify

• Event Submit و React Toastify Event Submit and React Toastify

• Slug ایجاد کنید Create a Slug

• Slug ایجاد کنید Create a Slug

عملکرد رویدادها - قسمت 2 Events Functionality - Part 2

عملکرد رویدادها - قسمت 2 Events Functionality - Part 2

• حذف رویدادها Delete Events

• حذف رویدادها Delete Events

• ویرایش پیش نمایش رویداد و تصویر Edit Event and Image Preview

• ویرایش پیش نمایش رویداد و تصویر Edit Event and Image Preview

• جزء معین Modal Component

• جزء معین Modal Component

• آپلود تصویر Image Upload

• آپلود تصویر Image Upload

• صفحه بندی رویدادها Events Pagination

• صفحه بندی رویدادها Events Pagination

کوکی‌های احراز هویت، JWT و HttpOnly Authentication, JWT, and HttpOnly Cookies

کوکی‌های احراز هویت، JWT و HttpOnly Authentication, JWT, and HttpOnly Cookies

• فرم های ثبت نام و ورود Register and Login Forms

• فرم های ثبت نام و ورود Register and Login Forms

• زمینه تأیید اعتبار Auth Context

• زمینه تأیید اعتبار Auth Context

• استراتژی JWT ما توضیح داده شد Our JWT Strategy Explained

• استراتژی JWT ما توضیح داده شد Our JWT Strategy Explained

• وارد شوید و JWT را دریافت کنید Login and Get JWT

• وارد شوید و JWT را دریافت کنید Login and Get JWT

• JWT را در کوکی HttpOnly سرور ذخیره کنید Store JWT in Server HttpOnly Cookie

• JWT را در کوکی HttpOnly سرور ذخیره کنید Store JWT in Server HttpOnly Cookie

• ادامه کاربر وارد شده Persist Logged In User

• ادامه کاربر وارد شده Persist Logged In User

• خروج و نابود کردن کوکی Logout and Destroy Cookie

• خروج و نابود کردن کوکی Logout and Destroy Cookie

• ثبت نام کاربر Register User

• ثبت نام کاربر Register User

مجوز و دسترسی Authorization and Access

مجوز و دسترسی Authorization and Access

• رویدادهای کاربر سفارشی نقطه پایانی Custom User Events Endpoint

• رویدادهای کاربر سفارشی نقطه پایانی Custom User Events Endpoint

• دریافت رویدادهای کاربر برای داشبورد Getting User Events for Dashboard

• دریافت رویدادهای کاربر برای داشبورد Getting User Events for Dashboard

• نمایش رویدادهای داشبورد Display Dashboard Events

• نمایش رویدادهای داشبورد Display Dashboard Events

• ایجاد خط مشی مالک است برای رویدادها Create Is Owner Policy for Events

• ایجاد خط مشی مالک است برای رویدادها Create Is Owner Policy for Events

• مرتبط کردن رویدادها با کاربران Associating Events with Users

• مرتبط کردن رویدادها با کاربران Associating Events with Users

• ویرایش، حذف و آپلود تصویر تأیید شده Authenticated Edit, Delete and Image Upload

• ویرایش، حذف و آپلود تصویر تأیید شده Authenticated Edit, Delete and Image Upload

موارد اضافی و استقرار Extras and Deployment

موارد اضافی و استقرار Extras and Deployment

• نقشه را به صفحات رویداد اضافه کنید Add Map to Event Pages

• نقشه را به صفحات رویداد اضافه کنید Add Map to Event Pages

• Strapi Backend Deploy - Heroku Strapi Backend Deploy - Heroku

• Strapi Backend Deploy - Heroku Strapi Backend Deploy - Heroku

• Next.js Deploy - Vercel Next.js Deploy - Vercel

• Next.js Deploy - Vercel Next.js Deploy - Vercel

Project 2 - DevSpace Static Markdown Blog Project 2 – DevSpace Static Markdown Blog

Project 2 - DevSpace Static Markdown Blog Project 2 – DevSpace Static Markdown Blog

• معرفی پروژه Project Introduction

• معرفی پروژه Project Introduction

• مارک داون - چه چیزی و چرا؟ Markdown - What and Why?

• مارک داون - چه چیزی و چرا؟ Markdown - What and Why?

• دوره سقوط Markdown Markdown Crash Course

• دوره سقوط Markdown Markdown Crash Course

• Next.js و Tailwind CSS Setup Next.js and Tailwind CSS Setup

• Next.js و Tailwind CSS Setup Next.js and Tailwind CSS Setup

• مولفه طرح Layout Component

• مولفه طرح Layout Component

• استایل هدر و دم باد Header and Tailwind Styling

• استایل هدر و دم باد Header and Tailwind Styling

• درباره و 404 صفحه About and 404 Page

• درباره و 404 صفحه About and 404 Page

واکشی، تجزیه و نمایش پست‌های Markdown Fetch, Parse, and Display Markdown Posts

واکشی، تجزیه و نمایش پست‌های Markdown Fetch, Parse, and Display Markdown Posts

• فایل های علامت گذاری پست وبلاگ Blog Post Markdown Files

• فایل های علامت گذاری پست وبلاگ Blog Post Markdown Files

• دریافت پست ها و تجزیه و تحلیل Frontmatter Get Posts and Parse Frontmatter

• دریافت پست ها و تجزیه و تحلیل Frontmatter Get Posts and Parse Frontmatter

• نمایش پست ها Display Posts

• نمایش پست ها Display Posts

• مرتب سازی پست ها بر اساس تاریخ Sort Posts By Date

• مرتب سازی پست ها بر اساس تاریخ Sort Posts By Date

• جزء برچسب دسته Category Label Component

• جزء برچسب دسته Category Label Component

• ایجاد مسیرهای ثابت و داده های تک پستی Generate Static Paths and Single Post Data

• ایجاد مسیرهای ثابت و داده های تک پستی Generate Static Paths and Single Post Data

• نمایش پست وبلاگ منفرد Display Single Blog Post

• نمایش پست وبلاگ منفرد Display Single Blog Post

صفحه بندی و دسته بندی صفحات Pagination and Category Pages

صفحه بندی و دسته بندی صفحات Pagination and Category Pages

• شروع صفحه بندی - ایجاد مسیرها Start Pagination - Generate Paths

• شروع صفحه بندی - ایجاد مسیرها Start Pagination - Generate Paths

• واکشی پست های صفحه بندی شده Fetch Paginated Posts

• واکشی پست های صفحه بندی شده Fetch Paginated Posts

• مؤلفه پیوندهای صفحه بندی Pagination Links Component

• مؤلفه پیوندهای صفحه بندی Pagination Links Component

• صفحات دسته بندی Category Pages

• صفحات دسته بندی Category Pages

• پاک کردن دریافت پست ها Clean Up Get Posts

• پاک کردن دریافت پست ها Clean Up Get Posts

• نوار کناری دسته Category Sidebar

• نوار کناری دسته Category Sidebar

• صادرات و محدودیت های بعدی Next Export and Limitations

• صادرات و محدودیت های بعدی Next Export and Limitations

جستجو، ذخیره پست‌ها و استقرار Search, Caching Posts, and Deployment

جستجو، ذخیره پست‌ها و استقرار Search, Caching Posts, and Deployment

• جستجو چگونه کار خواهد کرد How Search will Work

• جستجو چگونه کار خواهد کرد How Search will Work

• کامپوننت جستجو Search Component

• کامپوننت جستجو Search Component

• مسیر API را جستجو کنید Search API Route

• مسیر API را جستجو کنید Search API Route

• اجزای نتایج جستجو Search Results Components

• اجزای نتایج جستجو Search Results Components

• اولین استقرار First Deployment

• اولین استقرار First Deployment

• پست های کش Cache Posts

• پست های کش Cache Posts

• قلاب پیش از ارتکاب با هاسکی Pre-Commit Hook with Husky

• قلاب پیش از ارتکاب با هاسکی Pre-Commit Hook with Husky

• بسته شدن Wrap Up

• بسته شدن Wrap Up